What is remark-rehype?
The remark-rehype npm package is a plugin that transforms Markdown (.md) files into HTML. It is part of the unified ecosystem and is commonly used to integrate with other unified plugins to process and manipulate content.
What are remark-rehype's main functionalities?
Markdown to HTML conversion
This feature allows you to convert Markdown content into HTML. The code sample demonstrates how to set up a unified processor that parses Markdown, converts it to HTML using remark-rehype, and then serializes it to a string.
const unified = require('unified');
const markdown = require('remark-parse');
const remark2rehype = require('remark-rehype');
const html = require('rehype-stringify');
unified()
.use(markdown)
.use(remark2rehype)
.use(html)
.process('# Hello world!', function (err, file) {
if (err) throw err;
console.log(String(file));
});
Integration with unified ecosystem
remark-rehype can be used in conjunction with other plugins in the unified ecosystem, such as rehype-format for formatting the resulting HTML. The code sample shows how to include the rehype-format plugin in the processing pipeline.
const unified = require('unified');
const markdown = require('remark-parse');
const remark2rehype = require('remark-rehype');
const rehypeFormat = require('rehype-format');
const html = require('rehype-stringify');
unified()
.use(markdown)
.use(remark2rehype)
.use(rehypeFormat)
.use(html)
.process('# Hello world!', function (err, file) {
if (err) throw err;
console.log(String(file));
});
Other packages similar to remark-rehype
remark-html
remark-html is a remark plugin to compile Markdown to HTML. It is similar to remark-rehype but does not use the rehype ecosystem, which means it has less flexibility in terms of further HTML manipulations.
showdown
Showdown is a JavaScript Markdown to HTML converter, which can be used on both the server and in the browser. Unlike remark-rehype, it is not part of the unified ecosystem and operates as a standalone converter.
![Chat](https://img.shields.io/badge/join%20the%20community-on%20spectrum-7b16ff.svg)
remark plugin to bridge or mutate to rehype.
Note: remark-rehype
doesn’t deal with HTML inside the Markdown.
You’ll need rehype-raw
if you’re planning on doing that.
Install
npm:
npm install remark-rehype
Use
Say we have the following file, example.md
:
# Hello world
> Block quote.
Some _emphasis_, **importance**, and `code`.
And our script, example.js
, looks as follows:
var vfile = require('to-vfile')
var report = require('vfile-reporter')
var unified = require('unified')
var markdown = require('remark-parse')
var remark2rehype = require('remark-rehype')
var doc = require('rehype-document')
var format = require('rehype-format')
var html = require('rehype-stringify')
unified()
.use(markdown)
.use(remark2rehype)
.use(doc)
.use(format)
.use(html)
.process(vfile.readSync('example.md'), function(err, file) {
console.error(report(err || file))
console.log(String(file))
})
Now, running node example
yields:
example.md: no issues found
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>example</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<h1>Hello world</h1>
<blockquote>
<p>Block quote.</p>
</blockquote>
<p>Some <em>emphasis</em>, <strong>importance</strong>, and <code>code</code>.</p>
</body>
</html>
API
remark (mdast) plugin to bridge or mutate to
rehype (hast).
destination
If a Unified
processor is given, runs the destination processor
with the new hast tree, then, after running discards that tree and continues on
running the origin processor with the original tree (bridge mode).
Otherwise, passes the tree to further plugins (mutate mode).
options
Passed to mdast-util-to-hast
.
Related
Contribute
See contributing.md
in remarkjs/.github
for ways
to get started.
See support.md
for ways to get help.
This project has a Code of Conduct.
By interacting with this repository, organisation, or community you agree to
abide by its terms.
License
MIT © Titus Wormer